<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<%@ include file="/v2/console/common/taglibs.jsp"%>
<!DOCTYPE HTML>
<html>
<head>
	<title>校咖官网</title>
	<meta http-equiv="pragma" content="no-cache">
	<meta http-equiv="cache-control" content="no-cache">
	<meta http-equiv="expires" content="0">    
	<meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
	<meta http-equiv="description" content="This is my page">
	<link rel="stylesheet" href="${path}/v2/site/css/homepage.css">
	<script src="${path}/v2/console/js/jquery-1.9.1.min.js"></script>
	<script src="${path}/v2/site/artjs/template.js"></script>
</head>
<body>
<div class="header">
	<jsp:include page="header.jsp"></jsp:include>
    <div class="homeMain clearfix">
        <div class="homeMain_tips clearfix">
            <div class="homeBanner_tips fl">
                <div class="homeBanner" id="piccontent"></div>
                <div class="point" id="foucuscontent"></div>
            </div>
            
        </div>
        
        <div class="navcont clearfix">
            <p class="navcontbg"></p>
            </br>
            <c:forEach items="${slist}" var="sobj">
            	<div>
            		<a href="${sobj.url }">
	                <img src="${staticpath}${sobj.pic}" alt="${sobj.name }"/>
	                </a>
	                <p>${sobj.name }</p>
	            </div>
            </c:forEach>
        </div>
        
        <div class="newsbox clearfix">
        	<p class="navcontbg"></p>
        	<div class="none fl">
        	 <h2 class="navcont_title">校咖计划简介</h2>
       		 <%-- <span class="fl"><img alt="" src="${path}/v2/site/img/pifu01.png"></span> --%>
       		 	<span class="fl"><img alt="" src="${path}/v2/site/img/renzheng.jpg" width="283" height="388"></span>
       		 <%-- <span><img alt="" src="${path}/v2/site/img/pifu02.png"></span> --%>
       		 <p class="fr">以微信、微博、直播等为代表的社会化媒体，发展迅猛。依托其开展营销和推广活动，几乎是所有企事业单位都要做的事情，也是移动电子商务成功的关键。当前社会化媒体营销(SMM)岗位需求巨大，仅微信运营岗位就有1400多之万。但SMM专业人才却极其匮乏。在这样的背景下工信部人才交流中心开展了“国家急需紧缺人才培养工程——校咖计划”，对于通过培训和考试的学员，将颁发工信部《国家急需紧缺人才证书》，该计划同时得到了中国电子商务协会创业分会的鼎力支持！项目拟在全国建立数百个“校咖创新创业基地”，服务内容包括：技能培训、创新实践、实习就业、创业孵化。<a href="http://www.xiaoka360.com/web/1473145054801005/1473320402045002.html">更多>>></a></p>
        	</div>
        	<div class="newsList fr">
                <p class="navcont_title">新闻动态</p>
                <ul class="listul">
                	<c:forEach items="${NomeTnode.arlist}" var="article" varStatus="status">
                    	<a href="${pageContext.request.contextPath}/web/${article.nodeId}/${article.articleId }.html"><li>${fn:substring(article.title, 0, 26)}</li></a>
                    </c:forEach>
                </ul>
            </div>
        </div>
        
        <div class="project">
            <p class="navcontbg"></p>
           <%--  <p class="navcont_title">项目合作</p>
            <div class="project_cont">
            	<c:forEach items="${plist}" var="pobj">
            		<p class="fl">
            			<a href="${sobj.url }">
	                    <img src="${staticpath}${pobj.pic}" alt="${pobj.name}"/>
	                    </a>
	                </p>
            	</c:forEach>
            </div> --%>
        </div>
    </div>
    
        <jsp:include page="footer.jsp"></jsp:include>
</div>
		<script id="loadpic" type="text/html">
				{{each alist as value i}}
				<div class="one same" 
                {{if i>0}}
                  style="display:none"
                {{else}}{{/if}}
                  >
					<a href="${pageContext.request.contextPath}/web/{{value.nodeId }}/{{value.articleId }}.html">
						<img src="${staticpath}{{value.picLink}}"/>

					</a>
				</div>
				{{/each}}
		</script>                                                                                                  
		<script id="picFocus" type="text/html">                                                                    
				{{each alist as value i}}                                                                          
					{{if i == 0}}                                                                                  
						<span style="background: white"></span>                                                    
					{{else}}
						<span></span>
					{{/if}}
				{{/each}}
		</script>
<script>
		$(function(){
			loadPic();
		    var i=0;
		    window.setInterval(function () {
		        if(i==$(".same").length){
		            i=0;
		        }
		        carousel(i);
		        i++;
		    },3000);
		});

		function carousel(j){
		    for(var i=0;i<$(".same").length;i++){
		        $($(".same")[i]).css("display","none");
		    }
		    for(var i=0;i<$(".point span").length;i++){
		        $($(".point span")[i]).css("background","gainsboro");
		    }
		    $($(".same")[j]).css("display","block");
		    $($(".point span")[j]).css("background","white");
		}
		///加载轮播图片
		function loadPic(){
			$.ajax({
				type : "post",
				url : "${path}/web/loadpic.html",
				dataType : "json",
				data:{},
				async : false,
				success : function(data) {
					if(data.ajax_status == "ajax_status_success"){
						var phtml = template('loadpic', data);
						$('#piccontent').append(phtml);
						var fhtml = template('picFocus', data);
						$('#foucuscontent').append(fhtml);
					}else{
						alert(data.msg);
					}
					
				},
				error : function(XMLHttpRequest, textStatus, errorThrown){
		          alert("出错了！");
		       }
			});
		}

</script>
</body>
</html>
						<!-- <p class="" style="color:white;margin:0;">&nbsp;&nbsp;{{value.title }}</p> -->